<extend name="Public:base"/>

<block name="body">
    <style type="text/css">

        #body {
            width: 95%;
            background: white;
            border-radius: 10px;
            margin: 2.5%;
            position: relative;
        }
        .add_button {
            margin: 20px 2.5%;
            height: 40px;
            width: 80px;
        }
        .btn-default {
            color: #fff;
            background-image: none;
            background-color: rgba(255, 150, 47, 1);
            border: none;
        }
        .btn-default:focus, .btn-default:hover {
            color: #fff;
            background-image: none;
            border: none;
            background-color: rgba(255, 150, 47, 1);
        }
        #data_tr > td > span {
            margin: 5px;
            color: #00aaee;
            cursor: pointer;
        }
        thead > tr > th {
            text-align: center;
        }
        #data_tr > td {
            text-align: center;
        }

    </style>
    <div id="body">
        <button type="button" data-toggle="modal" data-target="#myModal" class="btn btn-default add_button ">添加</button>
        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">添加</h4>
                    </div>
                    <div class="modal-body">
                        <form action="" enctype="multipart/form-data" onsubmit="return false">
                            <div class="input-group input-group-lg">
                                <span class="input-group-addon">部门名称</span>
                                <input type="text" class="form-control" id="name" aria-describedby="sizing-addon1">
                            </div>
                            <br/>
                            <div class="input-group input-group-lg">
                                <span class="input-group-addon">职能描述</span>
                                <textarea id="text" style="width: 100%;height: 100px;"></textarea>
                            </div>

                            <p style="text-align: center">
                                <button type="button" data-dismiss="modal" class="btn add_button ">取消</button>
                                <button type="button" id="add" class="btn btn-default add_button ">添加</button>
                            </p>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <div class="row" style="margin: auto;width: 97%">
            <div class="col-xs-12">
                <table class="table table-striped table-bordered">
                    <thead>
                    <tr>
                        <th>部门名称</th>
                        <th>职能描述</th>
                        <th>成员数量</th>
                        <th>添加时间</th>
                        <th>是否启用</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <volist name="data" id="vo">
                        <tr id="data_tr" style="overflow: hidden">
                            <td>{$vo.name}</td>
                            <td>{$vo.text}</td>
                            <td><a href="user.html?d={$vo.id}" style="text-decoration:none">{$vo.number}</a></td>
                            <td>{$vo.time}</td>
                            <td><php>echo  $vo['type']=='1'?'<span onclick="type('.$vo['id'].','.$vo['type'].')">关闭</span>':'<span onclick="type('.$vo['id'].','.$vo['type'].')">启用</span>';</php></td>
                            <td>
                                <span><a href="group.html?id={$vo.id}">权限设置</a></span>
                                <span onclick="edit('{$vo.id}','select')">编辑</span>
                                <span onclick="edit('{$vo.id}','del')">删除</span>
                            </td>
                        </tr>
                    </volist>
                    </tbody>
                </table>
                {$page}
                <!-- PAGE CONTENT ENDS -->
            </div><!-- /.col -->
        </div>
    </div>

    <script>
        $('#add').click(function () {
            var name=$('#name').val();
            var text=$('#text').val();
            if(name !== '' && text !== ''){
                $.post('department',{name:name,text:text,key:'add'},function (res) {
                    if(res.code){
                        bootbox.alert({
                            title:'系统提示',
                            message:res.msg
                        }) ;
                        setTimeout(function () {
                            window.location.reload()
                        },2000)
                    }else {
                        bootbox.alert({
                            title:'系统提示',
                            message:res.msg
                        })
                    }
                })
            }else {
                bootbox.alert({
                    title:'系统提示',
                    message:'请输入完整信息'
                })
            }
        });
        function edit(id,event) {
            if(event === 'select'){
                $.post('department',{id:id,key:event},function (res) {
                    bootbox.dialog({
                        message: '<div class="input-group input-group-lg">' +
                            '<span class="input-group-addon" id="sizing-addon1">项目名称</span>' +
                            '<input type="text" class="form-control" id="edit_name" value="'+res.name+'" aria-describedby="sizing-addon1">' +
                            '</div><br/>' +
                            '<div class="input-group input-group-lg">' +
                            '<span class="input-group-addon">职能描述</span>' +
                            '<textarea id="edit_text" style="width: 100%;height: 100px;">'+res.text+'</textarea>' +
                            '</div>',
                        title: "编辑",
                        buttons: {
                            success: {
                                label: "关闭",
                                className: "btn-danger",
                                callback: function() {}
                            },
                            "Danger": {
                                label: "确认",
                                className: "btn-success",
                                callback: function() {
                                    var name=$('#edit_name').val();
                                    var text=$('#edit_text').val();
                                    var id=res.id;
                                    $.post('department',{name:name,id:id,text:text,key:'edit'},function (res) {
                                        if(res.code){
                                            bootbox.alert({
                                                title:'系统提示',
                                                message:res.msg
                                            });
                                            setTimeout(function () {
                                                window.location.reload();
                                            },2000)
                                        }else {
                                            bootbox.alert({
                                                title:'系统提示',
                                                message:res.msg
                                            })
                                        }
                                    })
                                }
                            }
                        }
                    });
                })
            }else if(event === 'del'){
                bootbox.dialog({
                    message: '是否删除',
                    title: "系统提示",
                    buttons: {
                        success: {
                            label: "关闭",
                            className: "btn-danger",
                            callback: function () {
                            }
                        },
                        "Danger": {
                            label: "确认",
                            className: "btn-success",
                            callback: function () {
                                $.post('department',{id:id,key:event},function (res) {
                                    if(res.code){
                                        bootbox.alert({
                                            title:'系统提示',
                                            message:res.msg
                                        }) ;
                                        setTimeout(function () {
                                            window.location.reload()
                                        },2000)
                                    }else {
                                        bootbox.alert({
                                            title:'系统提示',
                                            message:res.msg
                                        })
                                    }
                                })
                            }
                        }
                    }
                });
            }
        }
        function  type(id,type) {
            $.post('department',{id:id,key:'type',type:type},function (res) {
                if(res.code){
                    bootbox.alert({
                        title:'系统提示',
                        message:res.msg
                    }) ;
                    setTimeout(function () {
                        window.location.reload()
                    },2000)
                }else {
                    bootbox.alert({
                        title:'系统提示',
                        message:res.msg
                    })
                }
            })
        }
    </script>

</block>